﻿@model DauGiaApp.Models.TaiKhoan
@{
    ViewBag.Title = "Đăng Ký Thông Tin Tài Khoản";
}
<script src="../../Scripts/jquery-1.6.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="../../Scripts/D4Scripts/d4script.js" type="text/javascript"></script>
<script type="text/javascript">

    $(document).ready(function () {
        $("#form-dang-ky").validate({
            rules: {
                TenTaiKhoan: {
                    required: true,
                    minlength: 3
                },
                MatKhau: {
                    required: true,
                    minlength: 6
                },
                MatKhauXacNhan: {
                    required: true,
                    equalTo: "#MatKhau"
                }
            },
            messages: {
                TenTaiKhoan: {
                    required: "Vui lòng nhập tên tài khoản",
                    minlength: "Tên tài khoản phải có ít nhất 3 kí tự"
                },
                MatKhau: {
                    required: "Vui lòng nhập mật khẩu",
                    minlength: "Mật khẩu phải có ít nhất 6 kí tự"
                },
                MatKhauXacNhan: {
                    required: "Vui lòng nhập mật khẩu xác nhận",
                    equalTo: "Mật khẩu xác nhận không khớp"
                }

            }
        });
    });
    
</script>
<script type="text/javascript">

    var $isValid = false;
    $(function () {
        var $inputRes = $('input[name=recaptcha_response_field]');
        $inputRes.blur(function () {
            CheckValidate();
        });

    });
    function CheckValidate() {
        $.ajax({
            type: "POST",
            url: "/TaiKhoan/CheckCaptCha",
            dataType: "text json",
            data: $("#form-dang-ky").serialize(),
            success: function (data) {
                if (data.IsOk == 'no') {
                    $isValid = false;
                    $('#loi_recaptcha').text("mã xác nhận bị sai!");
                    $('#loi_recaptcha').show('fast');
                    $('#loi_recaptcha').fadeIn('slow');

                } else {
                    $isValid = true;
                    $('#loi_recaptcha').text("mã xác nhận đã đúng");
                    $('#loi_recaptcha').hide('fast');
                }
            }

        });
    }

    function DangKy() {
        if ($isValid == false) {
            alert("vui lòng nhập đúng mã xác nhận!");
            return "0";
        }

        $("#loader p").text("Đang gởi thông tin đăng ký");

        $.ajax({
            type: "POST",
            url: "/TaiKhoan/DangKy",
            dataType: "text",
            data: $("#form-dang-ky").serialize(),
            success: function (data) {
                alert(data);
                $("#loader p").text("đợi một tí. Đang kiểm tra mã xác nhận cho bạn!...");
            }


        });


    }
    
</script>
<h2 class="title_hot">
    Đăng ký tài khoản</h2>
<form id="form-dang-ky" onsubmit="return false;">
<table width="100%">
    <tr>
        <td>
            Tên tài khoản
        </td>
        <td>
            <input id="TenTaiKhoan" name="TenTaiKhoan" type="text" value="" />
        </td>
    </tr>
    <tr>
        <td>
            Email
        </td>
        <td>
            <input id="Email" name="Email" type="text" value="" />
        </td>
    </tr>
    <tr>
        <td>
            Mật khẩu
        </td>
        <td>
            <input type="password" id="MatKhau" name="MatKhau" type="text" value="" />
        </td>
    </tr>
    <tr>
        <td>
            Xác nhật lại mật khẩu
        </td>
        <td>
            <input type="password" id="MatKhauXacNhan" name="MatKhauXacNhan" type="text" value="" />
        </td>
    </tr>
    <tr>
        <td colspan="3">
            @ReCaptcha.GetHtml(theme: "white")
        </td>
    </tr>
    <tr>
        <td colspan="3">
            <div id="loi_recaptcha" style="color: Red;">
            </div>
        </td>
    </tr>
    <tr>
        <td colspan="3">
            <div id="loader" style="display: none;">
                <p>
                    đợi một tí. Đang kiểm tra mã xác nhận cho bạn!...</p>
                <img src="../../Content/images/ajax-loader.gif" alt="loading..." />
            </div>
            <button id="btn-dang-ky" onclick="DangKy();">
                Đăng Ký</button>
        </td>
    </tr>
</table>
</form>
